<template>

<div>
  <el-row :gutter="15">

    <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">

        <el-col :span="24" class="card-box">
          <el-card >
            <div slot="header" class="clearfix">
              <span>基础信息</span>
            </div>
            <div>
              <el-col :span="12">
                <el-form-item label="员工姓名" prop="employeeName">
                  <el-input v-model="formData.employeeName" placeholder="员工姓名" clearable
                            :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="岗位" prop="jobName">
                  <el-input v-model="formData.jobName" placeholder="请输入岗位" clearable
                            :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>

              <el-col :span="12">
                <el-form-item label="绩效考核月" prop="performanceDate">
                  <el-date-picker type="month" v-model="formData.performanceDate" format="yyyy-MM"
                                  value-format="yyyy-MM" :style="{width: '100%'}" placeholder="请选择日期选择" clearable>
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </div>
          </el-card>
        </el-col>

        <el-col :span="24" class="card-box">
          <el-card >
            <div slot="header" class="clearfix">
              <span>绩效填报</span>
            </div>
            <el-col :span="24" class="card-box">
            <el-card shadow="always">
              <el-col :span="23">
                <el-form-item label="建设运营情况" prop="constructionOperationDetails">
                  <el-input v-model="formData.constructionOperationDetails" type="textarea" placeholder="请输入内容"
                            :autosize="{minRows: 10, maxRows: 30}" :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
            </el-card>
            </el-col>
            <el-col :span="24" class="card-box">
              <el-card shadow="always">
                <el-col :span="23">
                  <el-form-item label="业务专项工作" prop="specialWork">
                    <el-input v-model="formData.specialWork" type="textarea" placeholder="请输入内容"
                              :autosize="{minRows: 10, maxRows: 30}" :style="{width: '100%'}"></el-input>
                  </el-form-item>
                </el-col>
              </el-card>
            </el-col>
            <el-col :span="24" class="card-box">
              <el-card shadow="always">
                <el-col :span="23">
                  <el-form-item label="安全运维工作" prop="safetyOperation">
                    <el-input v-model="formData.safetyOperation" type="textarea" placeholder="请输入内容"
                              :autosize="{minRows: 10, maxRows: 30}" :style="{width: '100%'}"></el-input>
                  </el-form-item>
                </el-col>
              </el-card>
            </el-col>
            <el-col :span="24" class="card-box">
              <el-card shadow="always">
                <el-col :span="23">
                  <el-form-item label="加分项" prop="addingScoreItems">
                    <el-input v-model="formData.addingScoreItems" type="textarea" placeholder="请输入内容"
                              :autosize="{minRows: 10, maxRows: 30}" :style="{width: '100%'}"></el-input>
                  </el-form-item>
                </el-col>
              </el-card>
            </el-col>
          </el-card>
        </el-col>


      <el-col :span="24">
        <el-form label-width="100px">
          <el-form-item style="text-align: center;margin-left:-100px;margin-top:10px;">
            <el-button type="primary" @click="submitForm()">提交</el-button>
            <el-button @click="close()">返回</el-button>
          </el-form-item>
        </el-form>
      </el-col>
    </el-form>
  </el-row>
</div>
</template>
<script>
import { getUserProfile } from "@/api/system/user";
import { addMonthlyList, getMonthly, delMonthly, addMonthly, updateMonthly } from "@/api/system/monthly";

export default {
  components: {},
  props: [],
  data() {
    return {
      formData: {
        id: null,
        employeeId: null,
        employeeName: null,
        jobId: null,
        jobName: null,
        stateId: null,
        stateName: null,
        constructionOperationDetails: null,
        specialWork: null,
        safetyOperation: null,
        taskGroupOpinion: null,
        totalScore: null,
        taskManagerScore: null,
        taskManagerOpinion: null,
        addingScoreItems: null,
        itemGroupOpinion: null,
        itemManagerScore: null,
        itemManagerOpinion: null,
        performanceDate: null,
        createTime: null,
        creatorId: null,
        creatorName: null,
        groupMemberId: null,
        groupMemberName: null,
        groupMemberTime: null,
        managerId: null,
        managerName: null,
        managerDatetime: null,
        performanceScore: null,
        deptId: null,
        deptName: null
      },
      rules: {}
    }


  },
  computed: {},
  watch: {},
  created() {
    let op = this.$route.query.op;
    let id = this.$route.query.id;
    console.log("op-------------"+op)
    console.log("id-------------"+id)

    if (op == 'add'){
      //打开查询页面
      this.getAddMonthlyList();
    }else if (op == 'edit'){
      //打开编辑页面
      this.handleUpdate(id);
    }else if (op == 'detail'){
      //打开详情页面

    }else if (op == 'monthlyAudit'){
      //打开审核页面

    }

  },
  mounted() {},
  methods: {
    reset() {
      this.form = {
        id: null,
        employeeId: null,
        employeeName: null,
        jobId: null,
        jobName: null,
        stateId: null,
        stateName: null,
        constructionOperationDetails: null,
        specialWork: null,
        safetyOperation: null,
        taskGroupOpinion: null,
        totalScore: null,
        taskManagerScore: null,
        taskManagerOpinion: null,
        addingScoreItems: null,
        itemGroupOpinion: null,
        itemManagerScore: null,
        itemManagerOpinion: null,
        performanceDate: null,
        createTime: null,
        creatorId: null,
        creatorName: null,
        groupMemberId: null,
        groupMemberName: null,
        groupMemberTime: null,
        managerId: null,
        managerName: null,
        managerDatetime: null,
        performanceScore: null,
        deptId: null,
        deptName: null
      };
      this.resetForm("formData");
    },
    getAddMonthlyList() {
      addMonthlyList().then(response => {
        this.formData = response.data;
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["elForm"].validate(valid => {
            addMonthly(this.formData).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
                          });
      });
    },

    handleUpdate(id) {
      this.reset();
      getMonthly(id).then(response => {
        this.formData = response.data;
        //this.open = true;
        //this.title = "修改月度绩效管理";
      });
    },
  }
}

</script>
<style>



</style>
